@atlaskit/button

What is @atlaskit/button?

@atlaskit/button is a React component library for creating buttons with various styles and functionalities. It is part of Atlassian's design system and provides a consistent look and feel for buttons across applications.

What are @atlaskit/button's main functionalities?

Basic Button

This code sample demonstrates how to create a basic primary button using the @atlaskit/button package.

<Button appearance="primary">Primary Button</Button>

Button with Icon

This code sample shows how to create a button that includes an icon before the text.

<Button iconBefore={<SomeIcon />}>Button with Icon</Button>

Loading Button

This code sample demonstrates how to create a button that shows a loading spinner.

<Button isLoading>Loading Button</Button>

Disabled Button

This code sample shows how to create a button that is disabled and not interactive.

<Button isDisabled>Disabled Button</Button>

Custom Button Styles

This code sample demonstrates how to apply custom styles to a button.

<Button style={{ backgroundColor: 'red', color: 'white' }}>Custom Styled Button</Button>

Other packages similar to @atlaskit/button

react-bootstrap

React-Bootstrap provides a set of React components that implement the Bootstrap framework. It offers a wide range of button styles and functionalities similar to @atlaskit/button, but with the look and feel of Bootstrap.

material-ui

Material-UI is a popular React component library that implements Google's Material Design. It offers a variety of button components with extensive customization options, similar to @atlaskit/button, but follows Material Design guidelines.

antd

Ant Design (antd) is a comprehensive UI framework for React that provides a wide range of components, including buttons. It offers similar functionalities to @atlaskit/button but with a different design language and additional features.

README

Button

Buttons are used as triggers for actions. They are used in forms, toolbars, dialog footers and as stand-alone action triggers.

Installation

yarn add @atlaskit/button

Usage

Detailed docs and example usage can be found here.